<template>
  <div>
    <van-notice-bar
      text="足协杯战线连续第2年上演广州德比战，上赛季半决赛上恒大以两回合5-3的总比分淘汰富力。"
      left-icon="volume-o"
    />
    <van-row>
      <van-col span="1"></van-col>
      <van-col span="22">
        <van-swipe :autoplay="3000" indicator-color="white" class="swipe">
          <van-swipe-item
            v-for="(image, index) in images"
            :key="index"
            class="img-item"
          >
            <img :src="image" />
          </van-swipe-item>
        </van-swipe>
      </van-col>
      <van-col span="1"></van-col>
    </van-row>

    <div class="bottom">
      <!-- <van-button round type="danger" class="">圆形按钮</van-button> -->
      <!-- <van-button round type="danger" @click="goReport">圆形按钮</van-button> -->
      <div>
        <div class="btn" @click="goReport"></div>
        癫痫知识
      </div>
      <div>
        <div class="btn" @click="goReport"></div>
        报告查询
      </div>
    </div>
    <!-- <van-row class="bottom">
      <van-col span="12"></van-col>
      <van-col span="12"></van-col>
    </van-row> -->
  </div>
</template>

<script>
export default {
  components: {
 
  },
  name: "Home",
  data() {
    return {
      images: [
        "https://th.bing.com/th?id=OIP.tmvIu57hTRpXhPRWkBDDEQHaEK&w=333&h=187&c=8&rs=1&qlt=90&o=6&dpr=1.3&pid=3.1&rm=2",
        "https://th.bing.com/th?id=OIP.jSjEpsSIymcWqEREuvkc_QHaEK&w=333&h=187&c=8&rs=1&qlt=90&o=6&dpr=1.3&pid=3.1&rm=2",
      ],
    };
  },
  methods: {
    goReport() {
      this.$router.push("/report").catch((e) => e);
    },
  },
};
</script>

<style scoped>
.img-item {
  width: 300px;
  height: 200px;
}
img {
  width: 100%;
  height: 100%;
  /* border-radius: 20px; */
}
.swipe {
  /* margin: 20px; */
  margin-top: 30px;
}
.bottom {
  margin-top: 50px;
  display: flex;
  justify-content: space-around;
}
.btn {
  width: 60px;
  height: 60px;
  margin-bottom: 10px;
  background-color: red;
  border-radius: 50%;
}
</style>